<!DOCTYPE html>
<html style="width:100%;height:100%;border:0;margin:0;padding:0;overflow:hidden">

<head>
    <meta charset="utf-8">
    <title>monaco editor iframe</title>
    <meta name="description" content="Iframe with the monaco editor for improved encapsulation">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script>
        // The bootstrap script that is loaded in the iframe for monaco editor.
        // It loads the JavaScript files passed in the iframe URL.
        window.MonacoEnvironment = {};
        window.MonacoEnvironment.Locale = {
            language: "",
            data: {},
        };

        var search = window.location.search;
        if (search.charAt(0) === "?") {
            search = search.substr(1);
        }
        var parts = search.split("&");
        var bootstrapUrls = [];
        for (var i = 0; i < parts.length; ++i) {
            var part = parts[i];
            var kvPair = part.split("=");
            if (kvPair[0] === "bootstrap") {
                bootstrapUrls.push(decodeURIComponent(kvPair[1]));
            }
            else if (kvPair[0] === "instanceId") {
                window.MonacoEnvironment.InstanceId = parseInt(kvPair[1]);   
            }
        }
        if (bootstrapUrls.length > 0) {
            for (var i = 0; i < bootstrapUrls.length; ++i) {
                if (bootstrapUrls[i]) {
                    var script = document.createElement("script");
                    script.src = bootstrapUrls[i];
                    document.head.appendChild(script);
                }
            }
        }
        else {
            console.error("No bootstrap scripts were found");
        }
    </script>
</head>

<body style="width:100%;height:100%;border:0;margin:0;padding:0;">
    <div id="editor" style="width:100%;height:100%;border:0;margin:0;padding:0;" class="ui-monaco-editor ui-monaco-editor-framed"></div>
</body>

</html>